<template>
	<view>
		<view class="recommend">
			<view class="list">
				<view class="list_item" v-for="(item,index) in dataList" :key="index">
					<view class="item_body" @click="goTo(item)">
						<view class="body_left">
							<u-image :src="item.scenicPhoto|photoPrefix" radius="10px" width="225rpx" height="225rpx"
								:fade="true" duration="450"></u-image>
						</view>
						<view class="body_right">
							<view>
								<u-text size="38rpx" :text="item.scenicBase.scenicName" :lines="1"></u-text>
								<u-tag style="display: inline-block;" :text="item.scenicBase.scenicLevel+'A景区'"
									size="mini" bgColor="#E5342A" borderColor="#E5342A"></u-tag>
								<u-text :lines="1" :text="item.scenicBase.typeName"></u-text>
							</view>
							<view>
								<u-text size="24rpx" :lines="1" :text="'景点地址：'+item.scenicBase.scenicAddress"></u-text>
								<u-text size="24rpx" :lines="1"
									:text="'开放时间：'+item.scenicBase.startTime+'-'+item.scenicBase.endTime">
								</u-text>
							</view>
						</view>
					</view>
					<u-divider v-if="index+1 != dataList.length"></u-divider>
				</view>
			</view>
			<u-empty mode="list" :show="!dataList[0]">
			</u-empty>
		</view>
	</view>
</template>

<script>
	export default {
		name: 'sclist',
		props: {
			dataList: {
				type: Array,
				default: []
			}
		},
		methods: {
			goTo(item) {
				uni.navigateTo({
					url: '/pages/index/scenicDetails/index?item='+encodeURIComponent(JSON.stringify(item)),
				})
			}
		}
	}
</script>

<style lang="scss">
	.recommend {
		padding: 0 30rpx;

		.list {
			padding-top: 30rpx;

			.item_body {
				display: flex;

				.body_right {
					width: 100%;
					padding: 0 25rpx;
					display: flex;
					flex-direction: column;
					justify-content: space-between;
				}
			}
		}
	}
</style>
